<template>
	<view class="box">
		<view class="kong_box"></view>
		<view class="input_box">
			<input type="text" placeholder-class="placeholder" v-model='mobile' placeholder="请填写您的联系电话" />
		</view>
		<view class='contentbox'>
			<textarea class="text_center" placeholder-class="placeholder" v-model='content'
			 placeholder="请描述您遇到的问题,不少于15字" />
			<image v-if='imageurl' class='addimg' :src=' picture.getImgUrl(imageurl)'></image>
			<image v-else @click='upimg' class='addimg' src='../../static/image/fbbg_img_sctp@2x.png'></image>
		</view>
		<view class="btns flexs" @click='entrue'>确认</view>
	</view>
</template>

<script>
	import {createlist} from '@/api/personal.js'
	export default {
		data() {
			return {
				imageurl:'',
				mobile:'',
				content:''
			}
		},
		onLoad(option) {
			
		},
		methods: {
			upimg(){
				this.$api.uploadImg().then(res => {
					this.imageurl = res[0]
				})
			},
			entrue(){
				if (/^1[345789]\d{9}$/.test(this.mobile)) {
					if(this.content.length<15){
						this.$msg('请描述您遇到的问题,不少于15字')
						return
					}
					let obj = {
						mobile:this.mobile,
						content:this.content,
						image:this.imageurl
					}
					createlist(obj).then(res=>{
						if(res.code == 1){
							this.$msg(res.msg)
							setTimeout(()=>{
								uni.navigateBack({
									delta:1
								})
							},800)
						}else{
							this.$msg(res.msg)
						}
					})
				} else {
					this.$msg('请输入正确手机号')
				}
			}
		}
	}
</script>

<style>
	.box {
		width: 100%;
		height: 100%;
		background-color: #F5F5F5;
	}
	.kong_box {
		width: 100%;
		height: 20rpx;
		background-color: #F5F5F5;
	}
	.input_box {
		width: 690rpx;
		height: 80rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0rpx auto 0;
	}

	.input_box input {
		width: 100%;
		height: 80rpx;
		padding-left: 20rpx;
	}
	.placeholder {
		font-size: 28rpx;
		color: #999999;
	}
	
	.contentbox{
		height:auto;
		width:690rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0rpx auto 0;
	}
	.text_center {
		width: 690rpx;
		height: 300rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 20rpx auto 0;
		padding: 20rpx 0 0 20rpx;
	}
	.addimg{
		width:124rpx;
		height:124rpx;
		/* border:1rpx solid red; */
		margin-left: 20rpx;
		margin-bottom: 20rpx;
	}
	.btns {
		width: 650rpx;
		height: 88rpx;
		background: #FFDD47;
		border-radius: 10rpx;
		font-size: 30rpx;
		margin:60rpx auto 0;
	}
</style>

